<template>
  <div>
    <router-view />
    <footer>
      <router-link :to="{name: 'MHome'}">首页</router-link>
      <router-link :to="{name: 'MHome'}">分类</router-link>
      <router-link :to="{name: 'MHome'}">购物车</router-link>
      <router-link :to="{name: 'MHome'}">我的</router-link>
    </footer>
    <mt-tabbar v-model="selected">
      <mt-tab-item id="外卖">
        <i class="el-icon-platform-eleme"></i>
        <div>外卖</div>
      </mt-tab-item>
      <mt-tab-item id="订单">
        <i class="el-icon-notebook-2"></i>
        <div>订单</div>
      </mt-tab-item>
      <mt-tab-item id="发现">
        <i class="el-icon-goblet-square-full"></i>
        <div>发现</div>
      </mt-tab-item>
      <mt-tab-item id="我的">
        <i class="el-icon-user-solid"></i>
        <div>我的</div>
      </mt-tab-item>
    </mt-tabbar>
  </div>
</template>

<script>
export default {
  name: "M",
  data() {
    return {
      selected: '外卖'
    }
  },
  methods: {
  }
};
</script>

<style>
/*
1rem === 100px
*/
html {
  font-size: 26.6666667vw;
}
body {
  font-size: 16px;
}
</style>